<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>博客正文</title>
    <link rel="stylesheet" href="css/blog_list.css">
    <link rel="stylesheet" href="css/conmmon.css">
    <link rel="stylesheet" href="css/blog_content.css">
    <link rel="stylesheet" href="editor.md/css/editormd.preview.min.css" />
    <script src="js/jquery.min.js"></script>
    <script src="js/common.js"></script>
    <script src="editor.md/editormd.js"></script>
    <script src="editor.md/lib/marked.min.js"></script>
    <script src="editor.md/lib/prettify.min.js"></script>
</head>

<body>
<!-- 导航栏 -->
<div class="nav">
    <img src="img/logo2.jpg" alt="">
    <a class="title" href="myblog_list.html">我的博客系统</a>
    <!-- 用来占据中间位置 -->
    <span class="spacer"></span>
    <a href="blog_list.html">主页</a>
    <a href="blog_edit.html">写博客</a>
    <a href="login.html">登陆</a>
</div>
<!-- 版心 -->
<div class="container">
    <!-- 左侧个人信息 -->
    <div class="container-left">
        <div class="card">
            <img src="" class="avtar" alt="" id="photo">
            <h3 id="username"></h3>
            <a href="" id="gitee">gitee 地址</a>
            <div class="counter">
                <span>文章</span>
                <span>分类</span>
            </div>
            <div class="counter">
                <span id="artCount"></span>
                <span>1</span>
            </div>
        </div>
    </div>
    <!-- 右侧内容详情 -->
    <div class="container-right">
        <div class="blog-content">
            <!-- 博客标题 -->
            <h3 id="title"></h3>
            <!-- 博客时间 -->
            <div class="date">发布时间：<span id="updatetime"></span> &nbsp; &nbsp;
                阅读量：<span id="rcount"></span></div>
            <!-- 博客正文 -->
            <div id="editorDiv">

            </div>
            <div id="review">
                <h3 id="tip">有什么建议:</h3>
                <textarea type="text" id="userdis" placeholder="说点什么吧...(66字以内)"></textarea>
                <br/>
                <button id="submit" onclick="subComment()">发布 &gt;&gt;</button>
                <!-- <button id="submit" onclick="delComment()">删除</button> -->
            </div>
            <!-- 发布评论 -->
            <div id="discussDiv">
                
            </div>         
           
        </div>
    </div>
</div>
<script type="text/javascript">
            var editormd;
            function initEdit(md){
                editormd = editormd.markdownToHTML("editorDiv", {
                markdown : md, // Also, you can dynamic set Markdown text
                // htmlDecode : true,  // Enable / disable HTML tag encode.
                // htmlDecode : "style,script,iframe",  // Note: If enabled, you should filter some dangerous HTML tags for website security.
                });
            }
            
            // console.log(getUrlValue("id"));
            // 查询文章详情
            function getArtDetail(id){
                if(id == ""){
                    alert("非法参数");
                    return;
                }
                jQuery.ajax({
                    url:"/art/detail",
                    type:"POST",
                    data:{"id":id},
                    success:function(result){
                        if(result != null && result.code == 200){
                            // 查询成功
                            jQuery("#title").html(result.data.title);
                            jQuery("#updatetime").html(result.data.updatetime);
                            jQuery("#rcount").html(result.data.rcount);
                            jQuery("#gitee").text(result.data.gitee);
                            initEdit(result.data.content);
                            //得到用户 id
                            showUser(result.data.uid);
                        }else{
                            alert("查询失败，请重试");
                        }
                    }
                });
            }
            getArtDetail(getUrlValue("id"));
            // 查询用户的详情信息
            function showUser(id){
                jQuery.ajax({
                    url:"/user/getuserbyid",
                    type:"POST",
                    data:{"id":id},
                    success:function(result){
                        if(result!=null && result.code==200 && result.data.id>0){
                            jQuery("#username").text(result.data.username);
                            jQuery("#artCount").text(result.data.artCount);
<!--                            $("#photo").attr("src","http://127.0.0.1:8080" + result.data.photo);-->
                            $("#photo").attr("src","http://"+ location.host + result.data.photo);
                        }else{
                            alert("抱歉：查询用户信息失败，请重试！");
                        }
                    }
                });
            }
            showUser(getUrlValue("id"));
            // 阅读量 +1
            function updataRCount(){
                // 先得到文章 id
                var id = getUrlValue("id");
                if(id!=""){
                    jQuery.ajax({
                        url:"/art/incr-rcount",
                        type:"POST",
                        data:{"id":id},
                        success:function(result){}
                    });
                }
            }
            updataRCount();

             
        // 展示评论信息
        function showComment(id) {
            if(id==""){
                alert("非法参数,访问失败");
                return;
            }
                jQuery.ajax({
                    url: "/comment/show",
                    type: "POST",
                    data: {"aid": id},
                    success: function (result) {
                        if (result != null && result.code == 200) {
                            var CommentListDiv = "";
                            for (var i = 0; i < result.data.length; i++) {
                                var CommentInfo = result.data[i];
                                CommentListDiv += '<div class="discussDiv">';
                                CommentListDiv += '<img src= "http://159.75.70.202:8086' + CommentInfo.photo +  '" id="image">';
                                CommentListDiv += '<span id="nickname">'+ '作者:' + CommentInfo.nickname +'</span>';
                                CommentListDiv += '<span id="createtime"> ' + '发布时间:' + CommentInfo.createtime + '</span>';
                                CommentListDiv += '<p class="comment">';
                                CommentListDiv += CommentInfo.comment;
                                CommentListDiv += '</p>';
                                //增加删除按钮
                                CommentListDiv +=  '<button onclick="delComment('+
                                CommentInfo.id+');" class="detail">删除 &gt;&gt;</button>'; 
                                CommentListDiv += '</div>';
                            }
                            // 将 html 填充进去
                            jQuery("#discussDiv").html(CommentListDiv);
                        } else {
                            alert("评论信息获取失败!");
                        }
                    }
                });
         }
        showComment(getUrlValue("id"));
 
        //删除评论
        function delComment(id) {
            var aid=getUrlValue("id");
            if (confirm("确定删除该评论?")) {
                jQuery.ajax({
                    url: "/comment/del",
                    type: "POST",
                    data: {
                        "id": id,
                        "aid": aid
                    },
                    success: function (result) {
                        if (result != null && result.code == 200 && result.data == 1) {
                            alert("评论删除成功!");
                            //刷新页面
                            location.href = location.href;
                        } else {
                            alert(result.msg);
                        }
                    }
                });
            }
        }
 
 
        //增加评论
        function subComment() {
            if(confirm("确认添加内容:")){
                //非空校验
                var aid = getUrlValue("id");
                var inputComment = jQuery("#userdis");
                if (inputComment.val() == "") {
                    alert("评论不能为空!");
                    inputComment.focus();
                    return;
                }
                jQuery.ajax({
                    url: "/comment/add",
                    type: "POST",
                    data: {
                        "aid": aid,
                        "comment": inputComment.val()
                    },
                    success: function (result) {
                        if (result != null && result.code == 200 && result.data == 1) {
                            alert("评论成功!");
                            //刷新当前页面
                            location.href = location.href;
                        } else {
                            alert(result.msg);
                        }
                    }
                });
            }
        }


    </script>
</body>

</html>